<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:t="http://www.w3.org/1999/xhtml">
<head th:replace="components/easyui/easyui-list :: head('日志管理', 'easyui')">
<body>
<div id="tb">
    <div class="datagrid-toolbar" style="padding-bottom: 6px">
        <span>日志等级: </span>
        <select class="easyui-combobox" id="search_levelString" name="levelString" style="width:160px">
            <option value="">&nbsp;&nbsp;</option>
            <option value="WARN">WARN</option>
            <option value="ERROR">ERROR</option>
        </select>
        <a href="javascript:void(0)" class="easyui-linkbutton c-primary" style="width:80px" onclick="doSearch()"><i class="fa fa-search" aria-hidden="true"></i> <span th:text="#{search}"></span></a>
        <a href="javascript:void(0)" class="easyui-linkbutton c-basic" style="width:80px" onclick="doSearchReset()"><i class="fa fa-repeat" aria-hidden="true"></i> <span th:text="#{reset}"></span></a>
    </div>
    <div class="datagrid-toolbar" style="padding-bottom: 6px">
        <a href="javascript:void(0)" class="button button-rounded button-small button-caution" onclick="emptyLogs()" th:text="#{emptyLogs}"></a>
    </div>
</div>
<table id="tt" data-options="url:'/api/loggingEvents/easyui/list',method:'get',animate: true,rownumbers:true,fit:true,toolbar: '#tb', pagination: true,idField:'eventId', singleSelect: true, selectOnCheck: true, checkOnSelect: true">
    <thead>
    <tr>
        <th data-options="field:'ck',checkbox:true"></th>
        <!--<th data-options="field:'eventId',width:80,sortable:true,align:'center'">事件id</th>-->
        <th data-options="field:'timestmp',width:160,sortable:true,align:'center',formatter:formatDate">时间</th>
        <th data-options="field:'levelString',width:120,sortable:true,align:'center',formatter:formatLevel">日志等级</th>
        <!--<th data-options="field:'loggerName',width:120,sortable:true,align:'center'">日志名称</th>-->
        <th data-options="field:'formattedMessage',width:540,sortable:true,align:'center'">格式化信息</th>
        <!--<th data-options="field:'callerFilename',width:200,sortable:true,align:'center'">调用文件名称</th>-->
        <th data-options="field:'callerClass',width:360,sortable:true,align:'center'">调用类</th>
        <th data-options="field:'callerMethod',width:120,sortable:true,align:'center'">调用方法</th>
        <th data-options="field:'callerLine',width:80,sortable:true,align:'center'">调用行号</th>
    </tr>
    </thead>
</table>

<div th:replace="components/easyui/easyui-list :: js('easyui')"></div>
<script>
    function formatLevel(val, row){
        if("WARN" == val.toUpperCase()){
            return '<a href="javascript:void(0)" class="button  button-pill button-highlight button-tiny">' + val + '</a>';
        }else if("ERROR" == val.toUpperCase()){
            return '<a href="javascript:void(0)" class="button  button-pill button-caution button-tiny">' + val + '</a>';
        }else{
            return '<a href="javascript:void(0)" class="button  button-pill button-tiny">' + val + '</a>';
        }
    }

    function emptyLogs(){
        /*$.messager.confirm('提示信息', '你确定清空日志吗？', function(r){
            if (r){
                emptyRequest("/api/loggingEvents");
            }
        });*/
        $.messager.confirm({
            title: '提示信息',
            msg: '你确定清空日志吗？',
            fn: function (r) {
                if (r){
                    emptyRequest("/api/loggingEvents");
                }
            }
        });
    }

    function doSearch() {
        $('#tt').datagrid('load', {
            levelString: $('#search_levelString').val()
        });
    }

    function doSearchReset() {
        $('#search_levelString').combobox('select', '');
        doSearch();
    }
</script>
</body>
</html>